import util from '@/libs/util';
import CONSTANTS from '@/config/constants';
import getDate from '@/util/getDate.js';
import Cookies from 'js-cookie';

export default {
    name: 'exportable-table',
    data () {
        return {
            columns: [{
                title: '序号',
                key: 'rownum',
                align: 'center',
                width: 60,
                render: (h, params) => {
                    return h('div', {}, ((this.pageIndex - 1) * this.pageSize + params.index + 1));
                }
            }, {
                title: '图片名称',
                key: 'name'
            }, {
                title: '缩略图',
                key: 'imgmin',
                render: (h, params) => {
                    let imgpath = this.SERVER_HOST + params.row.url;
                    return h('img', {
                        style: {
                            height: '60px'
                        },
                        attrs: {
                            src: imgpath
                        },
                        on: {
                            click: () => {
                                this.imgUrl = this.SERVER_HOST + params.row.url;
                                this.showImg = true;
                            }
                        }
                    });
                }
            }, {
                title: '所属机构',
                key: 'organizeid',
                render: (h, params) => {
                    if (params.row.organize)
                        return h('div', {}, params.row.organize.orgName);
                }
            }, {
                title: '描述',
                key: 'description'
            }, {
                title: '添加时间',
                key: 'createtime',
                render: (h, params) => {
                    return h('div', {}, getDate.getDate(params.row.createtime, 'time'));
                }
            }, {
                title: '操作',
                key: 'action',
                align: 'center',
                render: (h, params) => {
                    return h('div', [
                        h('Button', {
                            props: {
                                type: 'primary',
                                size: 'small'
                            },
                            style: {
                                marginRight: '5px'
                            },
                            on: {
                                click: () => {
                                    this.showEdit(params.row);
                                }
                            }
                        }, '修改'),
                        h('Button', {
                            props: {
                                type: 'error',
                                size: 'small'
                            },
                            on: {
                                click: () => {
                                    this.delete(params.row.id);
                                }
                            }
                        }, '删除')
                    ]);
                }
            }],
            data: [],
            formData: {},
            viewModal: false,
            showImg: false,

            total: 0,
            pageIndex: 1,
            pageSize: 8,

            uploadList: [],
            imgUrl: '',
            SERVER_HOST: CONSTANTS.SERVER_HOST,
            pictureDis: false,
            baseuser: JSON.parse(Cookies.get('baseUser')),
            orgList: [],
            queryCon: {
                name: ''
            }
        };
    },
    mounted () {
        this.loadList();
        util.ajax.post('/busine/organize/findAll', util.toFormData()).then(res => {
            this.orgList = res.data.data;
        });
    },
    methods: {
        loadList () {
            util.ajax.post('/busine/background/list', util.toFormData({
                page: this.pageIndex,
                size: this.pageSize,
                organizeid: this.baseuser.orgId,
                name: this.queryCon.name
            })).then(res => {
                this.data = res.data.data.list;
                this.total = res.data.data.total;
            });
        },
        showAdd () {
            this.formData = {
                status: 1
            };
            this.uploadList = this.$refs.upload.fileList = [];
            this.viewModal = true;
        },
        showEdit (obj) {
            let formData = {};
            for (let key in obj) {
                formData[key] = obj[key];
            }
            this.formData = formData;
            if (formData.url) {
                this.$refs.upload.fileList = [];
                this.uploadList = [{
                    status: 'finished',
                    showProgress: true,
                    url: this.SERVER_HOST + formData.url
                }];
                this.imgUrl = this.SERVER_HOST + formData.url;
            } else {
                this.uploadList = this.$refs.upload.fileList = [];
            }
            this.viewModal = true;
        },
        save () {
            let formData = {};
            for (let key in this.formData) {
                formData[key] = this.formData[key];
            }
            formData['createtime'] = getDate.getDate(formData['createtime'], 'time');
            formData['updatetime'] = getDate.getDate(formData['updatetime'], 'time');
            formData['organizeid'] = this.baseuser.type === 2 ? this.baseuser.orgId : (formData['organizeid'] ? formData['organizeid'] : '');
            util.ajax.post('/busine/background/save', util.toFormData(formData)).then(res => {
                if (res.data.message === 'SUCCESS') {
                    this.viewModal = false;
                    this.$Message.success('保存成功！');
                    this.loadList();
                } else {
                    this.$Message.warning(res.data.message || '未知错误！');
                }
            });
        },
        delete (id) {
            this.$Modal.confirm({
                title: '提示',
                content: '<p>确定删除？</p>',
                onOk: () => {
                    util.ajax.post('/busine/background/delete', util.toFormData({
                        id: id
                    })).then(res => {
                        if (res.data.message === 'SUCCESS') {
                            this.$Message.success('删除成功！');
                            this.loadList();
                        }
                    });
                },
                onCancel: () => {
                }
            });
        },
        handleSuccess (res, file) {
            this.uploadList = [{
                showProgress: true
            }]
            var xmlhttp = null;
            var urlPath = CONSTANTS.SERVER_HOST + res.data.imgUrl;
            if (window.ActiveXObject) {
                xmlhttp = new ActiveXObject("Microsoft.XMLDOM");
            } else {
                if (window.XMLHttpRequest) {
                    xmlhttp = new XMLHttpRequest();
                }
            }
            let interval = setInterval(() => {
                xmlhttp.open('GET', urlPath, false);
                xmlhttp.send();
                if ((xmlhttp.readyState === 4 && xmlhttp.status === 200)) {
                    clearInterval(interval);
                    this.$Notice.success({
                        title: '文件上传成功',
                        desc: '文件 ' + file.name + ' 上传成功。',
                        duration: 2
                    });
                    file.url = CONSTANTS.SERVER_HOST + res.data.imgUrl;
                    file.name = res.data.fileName;
                    this.uploadList = this.$refs.upload.fileList;
                    this.formData.url = res.data.imgUrl;
                    this.imgUrl = CONSTANTS.SERVER_HOST + res.data.imgUrl;
                    this.pictureDis = false;
                }
            }, 500);
        },
        handleFormatError (file) {
            this.$Notice.warning({
                title: '文件格式不正确',
                desc: '文件 ' + file.name + ' 格式不正确，请选择图片文件。',
                duration: 5
            });
            this.pictureDis = false;
        },
        handleMaxSize (file) {
            this.$Notice.warning({
                title: '超出文件大小限制',
                desc: '文件 ' + file.name + ' 太大，不能超过 2M。',
                duration: 5
            });
            this.pictureDis = false;
        },
        handleRemove (file) {
            this.uploadList = [];
            this.$refs.upload.fileList = [];
            this.formData.url = '';
        },
        handleBeforeUpload () {
            const check = this.uploadList.length < 1;
            if (!check) {
                this.$Notice.warning({
                    title: '最多只能上传 1 张图片。',
                    duration: 5
                });
            }
            this.pictureDis = true;
            return check;
        }
    }
}